<template>
    <el-dialog v-model="dialogFormVisible" :title="title" @close="closeDialog">
        <el-form :model="subjectForm" ref="addEditSubjectRef" :rules="addEditSubjectRules">
            <el-form-item label="学科名称" :label-width="formLabelWidth"
                          prop="reason" style="width:400px">
                <el-input v-model="subjectForm.subjectName" autocomplete="off" placeholder="请输入学科名称"></el-input>
            </el-form-item>
        </el-form>
        <template #footer  style="width:400px">
            <span class="dialog-footer">
                <el-button @click="clear()">取消</el-button>
                <el-button type="primary" @click="save">保存</el-button>
            </span>
        </template>
    </el-dialog>
</template>

<script>
    import {ref} from "vue";
    import {httpService} from "@/utils/httpService";
    import {ElMessage, ElForm, ElTree} from "element-plus";
    import {vxRule} from "@/utils/validator";

    export default {
        name: "teacher",
        components: {
            ElForm,
            ElMessage,
        },
        data() {
            return {
                dialogFormVisible: ref(false),
                addEditSubjectRef:"",
                subjectForm: {
                    subjectName: "",
                    subjectId:"",
                },
                // 校验规则
                addEditSubjectRules: {
                    subjectName: vxRule(true, null, "blur"),
                },
            };
        },
        mounted() {

        },
        methods: {
            closeDialog() {
                this.clear();
            },
            cancel() {
                this.clear();
            },
            clear() {
                this.dialogFormVisible = false;
                this.subjectForm.subjectName="";
            },
            getSubjectById(subjectId) {
                httpService("/pythonApi/scheduleApi/getSubjectList",
                    {
                        subjectId: subjectId,
                    }, "get").then(
                    (data) => {
                        if (data.code == 200) {
                            let temp = data.data;
                            this.subjectForm = temp[0];
                        }else{
                            ElMessage.error(data.message);
                        }
                    }
                );
            },
            save() {
                this.$refs.addEditSubjectRef.validate((valid) => {
                    if (valid){
                        let params = new FormData(); //创建一个form对象,必须是form对象否则后端接受不到数据
                        params.append("subjectName", this.subjectForm.subjectName);
                        params.append("subjectId", this.subjectForm.subjectId);
                        httpService("/pythonApi/scheduleApi/addSubject", params, "post").then(
                            (data) => {
                                if (data.code == 200) {
                                    ElMessage.success(data.message);
                                    this.clear();
                                    //刷新父组件的数据
                                    this.$parent.getSubjectList();
                                } else {
                                    ElMessage.error(data.message);
                                }
                            }
                        );
                    }
                })
            },
        },
    };
</script>
<style>
</style>